<template>
    <div v-if="show" class="ending-item">
        <span>已经到底了~~~</span>
    </div>
</template>

<script lang="ts" setup>
    import { onMounted, ref, watch } from 'vue';

    const props = defineProps<{ showEnding: boolean }>();
    const show = ref(false);

    onMounted(() => {
        show.value = props.showEnding;
    });

    watch(
        () => props.showEnding,
        (now) => {
            //关闭
            show.value = now;
        }
    );
</script>

<style scoped>
    .ending-item {
        height: 50px;
        text-align: center;
        background-color: #f3f3f3;
        line-height: 50px;
    }
</style>
